<!--
 * @Author: 汪军 624473119@qq.com
 * @Date: 2023-10-11 11:53:19
 * @LastEditors: 汪军 624473119@qq.com
 * @LastEditTime: 2023-10-11 18:04:40
 * @FilePath: \ekee-web\src\components\EnterpriseCenterTitle.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template lang="pug">
.attention-fans-card
  .card.flex.justify-between.w100
    .left.flex.justify-start
      .avatar
        img.imgUrl(v-if="item.avatar", :src="item.avatar")
        img.imgUrl(v-else src="../assets/images/account.png")
      .option.flex.column.align-start
        .name {{ item.name }}
        div
          span.attention.f3 关注：{{ item.attention_quantity }}
          span.fans.f3 粉丝：{{ item.fan_quantity }}
    .right
      el-button.submit-btn(type="info", @click="onItemChange(item)") {{ focus }}
</template>

<script setup>
import { ref } from "vue";
// {{ item.each == 1 ? "互相关注" : item.each == 0 ? "回关" : "互相关注" }}

defineProps({
  item: Array,
  type: 1,
});

const focus = ref("取消关注");

const emits = defineEmits(["change"]);

const errorHandler = () => true;

// 取消关注&&关注粉丝
const onItemChange = (item) => {
  emits("change", item);
};
</script>

<style lang="stylus" scoped>
.imgUrl {
      width: 72px;
      height: 72px;
    }
.attention-fans-card {
  .card {
    padding: 18px 0px;
    border-bottom: 1px solid #E6E6E6;

    .option {
      margin-left: 12px;
    }

    .name {
      margin-bottom: 25px;
      font-size: 22px;
      font-weight: bold;
    }

    .fans {
      margin-left: 30px;
    }

    .submit-btn {
      width: 104px;
    }
  }
}
</style>
